<template>
	<view class="pages_intelligence" :style="{paddingTop: `${search.height+search.top+10}px`}">
		<!-- <myTabs :backgroundColor="#fff"></myTabs> -->
		<myTabs :title="title" @goBlack="goBlack" :mybackgroundColor="'#f0f0f0'"></myTabs>

		<view class="pages_intelligenceBox" v-if="informationList.length">
			<view class="pages_intelligenceItems" @click="goPage(item)" v-for="(item,index) in informationList" :key="index">
				<view class="pages_intelligenceItemsLeft">
					<image mode="aspectFill" :src="item.coverImg"></image>
				</view>
				<view class="pages_intelligenceItemsRight">
					<view class="pages_intelligenceItemsRightText">{{item.informationTitle}}</view>
					<view class="pages_intelligenceItemsRightBox">
						<span class="pages_intelligenceItemsRightBoxTitle">{{item.categoryName}}</span>
						<view class="pages_intelligenceItemsRightBoxPath">
							<span>查看情报</span>
							<image src="/static/img/leftActionIcon.png"></image>
						</view>
					</view>
				</view>
			</view>
		</view>
	<view class="biaoyuBox" v-else>
		<image class="biaoyuImg" src="/static/img/kongIcon.png"></image>
		<p class="biaoyu">暂无情报～</p>
	</view>
	</view>

</template>
<script>
	import myTabs from "@/components/myTabs/index.vue"
	export default {
		components: {
			myTabs
		},
		data() {
			return {
				title: '我的情报',
				pageNum: 1,
				isPageSize: true,
				informationList: []

			}
		},
		onLoad() {
			// #ifndef H5
			let search = uni.getMenuButtonBoundingClientRect()
			this.$store.commit('updataSearch', search);
			// #endif
			this.init();
		},
		onReachBottom() {
			if(this.isPageSize){
				this.pageNum++;
				this.init();
			}
		},
		computed: {
			search() {
				return this.$store.state.search;
			},
		},
		methods: {
			
			goPage(item){
				uni.navigateTo({
					url:`/package/intelligence/index?informationId=${item.informationId}`
				})
			},
			init(){
				let req = {
					pageSize : 10,
					pageNum:　this.pageNum
				}
				this.$api.userInformationGetList(req).then(res=>{
					if(res.code==200){
						this.informationList = [...this.informationList,...res.rows];
						if(this.informationList.length == res.total){
							this.isPageSize = false
						}
					}
				})
			},
			goBlack() {
				uni.navigateBack();
			}
		}
	}
</script>

<style lang="scss" scoped>
	.pages_intelligence {
		background-color: #F0F0F0;
		min-height: 100vh;
		box-sizing: border-box;

		.pages_intelligenceItemsRightBox{
			display: flex;
			justify-content: space-between;
			align-items: center;
			
		}
		.pages_intelligenceItemsRightBoxTitle{
			background: #fff9dd;
			border-radius: 8rpx;
			height: 42rpx;
			line-height: 42rpx;
			padding: 0 12rpx;
			font-size: 24rpx;
			font-family: 蘋方-簡;
			font-weight: normal;
			color: #FFA102;
		}
		.pages_intelligenceItemsRightBoxPath{
			display: flex;
			align-items: center;
			span{
				display: inline-block;
				height: 34rpx;
				font-size: 24rpx;
				font-family: 蘋方-簡;
				font-weight: normal;
				line-height: 34rpx;
				color: #000000;
			}
			image{
				width: 24rpx;
				height: 24rpx;
				margin-left: 4rpx;
			}
		}
		.pages_intelligenceBox {
			width: 100%;
			padding: 32rpx;
			box-sizing: border-box;
		}
		.biaoyuBox{
			width: 100%;
			display: flex;
			flex-direction: column;
			align-items: center;
			margin-top: 240rpx;
		}
		.biaoyuImg{
			width: 320rpx;
			height: 320rpx;
		}
		.biaoyu{
			height: 40rpx;
			font-size: 28rpx;
			font-family: PingFang SC;
			font-weight: 400;
			line-height: 40rpx;
			color: #999;
			text-align: center;
		}

		.pages_intelligenceItems {
			// width: 100%;
			background-color: #fff;
			border-radius: 24rpx;
			padding: 24rpx;
			display: flex;
			bbox-sizing: border-box;
			margin-bottom: 16rpx;
		}
		

		.pages_intelligenceItemsLeft {
			flex: 0 0 192rpx;
			width: 192rpx;
			height: 144rpx;
			overflow: hidden;
			border-radius: 24rpx;
			margin-right: 24rpx;

			image {
				width: 100%;
				height: 100%;

			}
		}

		.pages_intelligenceItemsRight {
			flex: 1;
			    display: flex;
			    flex-direction: column;
			    justify-content: space-between;

		}

		.pages_intelligenceItemsRightText {
			height: 72rpx;
			font-size: 26rpx;
			font-family: 蘋方-簡;
			font-weight: normal;
			line-height: 32rpx;
			color: #666666;
			overflow: hidden;
			text-overflow: ellipsis;
		 display: -webkit-box;
			-webkit-line-clamp: 2;
			-webkit-box-orient: vertical;
			margin-bottom: 22rpx;
		}
	}
</style>
